window.addEventListener("load",function(){
    let inp=this.document.querySelector("input")
    let btn=this.document.querySelector("button")
    let ul=this.document.querySelector(".box")
    console.log(inp,btn,ul);

    btn.addEventListener("click",function(){
        let txt=inp.value
        let data=JSON.parse(localStorage.getItem("localData"))

        if(data!==null){
            let arr=data
            arr.unshift(txt)
            localStorage.setItem("localData",JSON.stringify(arr))
            ranD()
        }else{
            let arr=[]
            arr.unshift(txt)
            localStorage.setItem("localData",JSON.stringify(arr))
            ranD()
        }
        inp.value=""
    })


    function ranD(){
        let str=''
        let data=JSON.parse(localStorage.getItem("localData"))
        data.forEach(function(v){
            str+=`<li>${v}</li>`
            ul.innerHTML=str
        });
    }


    let clear=document.querySelector(".clear")
    console.log(clear);
    clear.addEventListener("click",function(){
        localStorage.clear()
        ul.textContent=""
    })

    if(!(this.localStorage.getItem("localData")==null)){
        ranD()
    }


})